<template>
  <div class="address">
    <div class="not-addr" v-if="list<0">
      <p>您当前还没有添加任何地址哦!</p>
    </div>
    <div class="addr-list" v-else>
      <van-address-list v-model="chosenAddressId" :list="list" :disabled-list="disabledList" disabled-text="以下地址超出配送范围" default-tag-text="默认" @edit="onEdit" @add="onAdd" />
    </div>
  </div>
</template>
<script>
import { Toast } from 'vant'
export default {
  data() {
    return {
      chosenAddressId: '',
      disabledList: [
        {
          id: '3',
          name: '鱿鱼大大',
          tel: '1320000000',
          address: '浙江省杭州市滨江区江南大道 15 号'
        }
      ],
      list: this.$store.state.address.addrList
    }
  },
  created() {
    this.chosenAddressId = this.list[0].id
  },
  watch: {
    list: {
      handler(newVal, oldVal) {
        newVal[0].isDefault = true
      },
      deep: true,
      immediate: true
    }
  },
  methods: {
    onAdd() {
      // Toast('新增地址')
      this.$router.push('/home/addAddr')
    },
    onEdit(item, index) {
      // console.log(item, index)
      Toast('编辑地址:' + item.id)
    }
  }
}
</script>
<style lang="scss" >
.address {
  .not-addr {
    padding: 20px 0;
    text-align: center;
    color: #999;
  }
  .van-address-list__bottom {
    background: none;
  }
}
</style>